<template>
    <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false"
               :title="dialogTit" :visible.sync="dtlVisible">
        <div class="mod-prod-info">
            <el-table :data="tableData" border style="width: 100%" tooltip-effect="dark">
                <!-- 序号 -->
                <el-table-column label="序号" type="index" width="70"></el-table-column>
                <!-- 名称很长显示悬浮窗 -->
                <!--        <el-table-column prop="indexDesc" label="名称" show-overflow-tooltip></el-table-column>-->
                <!-- 自定义参数类型 -->
              <el-table-column label="评估结果" prop="expertEvalResult" show-overflow-tooltip></el-table-column>
              <el-table-column label="复制结果" width="120">
                <template slot-scope="scope">
                  <el-button size="small" type="primary" @click="copyRow(scope.row,'3')">复制</el-button>
                </template>
              </el-table-column>
                <el-table-column label="存在短板" prop="expertEvalLack" show-overflow-tooltip></el-table-column>
              <el-table-column label="复制短板" width="120">
                <template slot-scope="scope">
                  <el-button size="small" type="primary" @click="copyRow(scope.row,'1')">复制</el-button>
                </template>
              </el-table-column>
                <!-- 自定义参数类型 -->
                <el-table-column label="专家建议" prop="expertEvalBiz" show-overflow-tooltip></el-table-column>
                <!-- 自定义参数类型 -->

                <el-table-column label="复制建议" width="120">
                    <template slot-scope="scope">
                        <el-button size="small" type="primary" @click="copyRow(scope.row,'2')">复制</el-button>
                    </template>
                </el-table-column>
            </el-table>

            <!-- 分页 -->
            <!--      <div class="pagination">-->
            <!--        <el-pagination-->
            <!--            background-->
            <!--            layout="total,prev,pager,next,sizes,jumper"-->
            <!--            :total="total"-->
            <!--            :page-sizes="[10]"-->
            <!--            :page-size="pageSize"-->
            <!--            :current-page.sync="pageNum"-->
            <!--            @size-change="handleSizeChange"-->
            <!--            @current-change="handleCurrentChange"-->
            <!--        >-->
            <!--        </el-pagination>-->
            <!--      </div>-->

        </div>
    </el-dialog>

</template>
<script>
import {getUUID} from '@/utils'
import {Debounce} from '@/utils/debounce'

export default {
	name: 'indexauditdtl',
	data () {
		return {
			dialogTit: '查看分项指标信息',
			dtlVisible: false,
			tableData: [],
			dataForm: {
				id: '',
				pid: '',
				bname: '',
				totalsets: '',
				presalesets: '',
				saledsets: '',
				layers: '',
				state: '',
				biz: ''
			},
			dataRule: {
				bname: [
					{required: true, message: '楼栋名称不能为空', trigger: 'blur'},
					{pattern: /\s\S+|S+\s|\S/, message: '请输入正确的楼栋名称', trigger: 'blur'}
				]
			}
		}
	},
	methods: {
		init (evalMainId) {
			this.dtlVisible = true
			this.getDataList(evalMainId)
		},
		copyRow (row,type) {
          if(type === "1"){
            this.copyToClipboard(row.expertEvalLack)
          }else if(type === "2"){
              this.copyToClipboard(row.expertEvalBiz)
          }else{
            this.copyToClipboard(row.expertEvalResult)
          }
		},
		copyToClipboard (text) {
			// navigator.clipboard.writeText(text)
			// 	.then(function () {
			// 		console.log('Text copied to clipboard')
			// 		this.$message.success('已复制内容到剪贴板')
			// 	})
			// 	.catch(function (err) {
			// 		console.error('Failed to copy text: ', err)
			// 	})

            //浏览器禁用了非安全域的 navigator.clipboard 对象
            //在线上环境会报错 TypeError: Cannot read properties of undefined (reading 'writeText')
            if (!navigator.clipboard && window.isSecureContext) {
                return navigator.clipboard.writeText(text)
            } else {
                // 判断是否支持拷贝
                if (!document.execCommand('copy')) return Promise.reject()
                // 创建标签，并隐藏
                const textArea = document.createElement('textarea')
                textArea.style.position = 'fixed'
                textArea.style.top = textArea.style.left = '-100vh'
                textArea.style.opacity = '0'
                textArea.value = text
                document.body.appendChild(textArea)
                // 聚焦、复制
                textArea.focus()
                textArea.select()
                return new Promise((resolve, reject) => {
                    // 不知为何，必须写这个三目，不然copy不上
                    document.execCommand('copy') ? resolve() : reject()
                    textArea.remove()
                })
            }
		},
		getDataList (evalMainId) {
			this.tableData = []
			this.$http({
				url: this.$http.adornUrl('/eval/getListDtlByMainId'),
				method: 'post',
				data: this.$http.adornData({
					evalMainId: evalMainId
				})
			}).then(({
				data
			}) => {
				console.log('🚀 ~ data', data)
				this.tableData = data

			})
		},
	}

}
</script>
